<template>
    <div>
        <button @click="isShow = !isShow">显示/隐藏</button>
        <transition name="feature">
          <h2  v-if="isShow">Hello World</h2>
        </transition>
    </div>
</template>

<script>
    export default {
        data() {
            return {
                isShow: true
            }
        },
        methods: {
            
        }
    }
</script>

<style scoped>
   

    .feature-enter-from,
    .feature-leave-to {
        opacity: 0;
    }

    .feature-enter-to,
    .feature-leave-from {
        opacity: 1;
    }

    .feature-enter-active,
    .feature-leave-active {
        transition: opacity 2s ease;
    }
</style>